<template>
  <div class="detailTable">
    <el-row style="margin-bottom: 10px;">
      <el-col :span="24" style="padding-right: 30px;padding-left: 40px;">
        <el-row>
          <el-col class="bott">
            <el-col :span="4">
              <el-col>
                <p class="title">工号</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.empno}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">登录账号</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.username}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">用户姓名</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.name}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">用户角色</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.sysRoles}}</p>
              </el-col>
            </el-col>
            <el-col :span="4" >
              <el-col>
                <p class="title">角色级别</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.roleLevel}}</p>
              </el-col>
            </el-col>
            <el-col :span="4" >
              <el-col>
                <p class="title">联系电话</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.phone}}</p>
              </el-col>
            </el-col>
          </el-col>
        </el-row>
        <el-row>
          <el-col class="bott">
            <el-col :span="4">
              <el-col>
                <p class="title">联系地址</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.addr}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">公司邮箱</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.email}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">新桥邮箱</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.sinoEmail}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">性别</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.sex}}</p>
              </el-col>
            </el-col>
            <el-col :span="4" >
              <el-col>
                <p class="title">生日</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.birthday | converTime("YYYY-MM-DD")}}</p>
              </el-col>
            </el-col>
            <el-col :span="4" >
              <el-col>
                <p class="title">学历</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.education}}</p>
              </el-col>
            </el-col>
          </el-col>
        </el-row>
        <el-row>
          <el-col class="bott">
            <el-col :span="4">
              <el-col>
                <p class="title">所属部门</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.companyNames}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">岗位名称</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.postName}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">所属小组</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.groupNames}}</p>
              </el-col>
            </el-col>
            <el-col :span="4">
              <el-col>
                <p class="title">所属地区</p>
              </el-col>
              <el-col>
                <p class="text">{{requiredata.addr}}</p>
              </el-col>
            </el-col>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import axios from 'axios'
import qs from 'qs'
export default {
  props:{
      detailData : {}
    },
  data(){
    return {
      requiredata:{}
    }
  },
  created(){
    axios.post(this.url + "/sysuser/getUserById",qs.stringify({
      id: this.detailData.id
    })).then(res => {
      this.unlogin(res.data.code);
       if(res.data.code == 200){
         let resData = res.data.data;
         resData.sys = [];
         resData.group = [];
         resData.company = [];
         resData.level = [];
         for(let i = 0, len = resData.sysRoles.length; i < len; i++){
           resData.sys.push(resData.sysRoles[i].name);
         }
         for(let i = 0, len = resData.companyNames.length; i < len; i++){
           resData.company.push(resData.companyNames[i].name);
         }
         for(let i = 0, len = resData.groupNames.length; i < len; i++){
           resData.group.push(resData.groupNames[i].name);
         }
         if(resData.roleLevel !== null){
           for(let i = 0, len = resData.roleLevel.length; i < len; i++){
             resData.level.push(resData.roleLevel[i].name);
           }
         }
    
         resData.sysRoles = resData.sys.join(",");
         resData.companyNames = resData.company.join(",");
         resData.groupNames = resData.group.join(",");
         resData.roleLevel = resData.level.join(",");
         delete resData.sys
         delete resData.company
         delete resData.group
         delete resData.level
         this.requiredata = resData;
      }
    })
 }
}
</script>
<style scoped>
  .detailTable{
    background-color:#fff;
    padding-top:10px;
  }
  .title {
    color: #757575;
    margin-bottom: 4px;
    font-size: 14px;
  }

  .text {
    color: #333333;
    font-weight: 700;
    font-size: 14px;
    margin-bottom:20px;
  }
</style>
